﻿@namespace Masa.Tsc.Web.Admin.Rcl.Pages.Apm
@inherits ApmComponentBase
@page "/apm/services"
<PageTitle>@I18n.Apm("PageTitles.Service")</PageTitle>

<ApmSearchComponent ShowComparison @ref=ApmSearchComponent
                    IsService
                    Value="Search"
                    ValueChanged="LoadASync" />
<SDataTable Headers="headers"
            Stripe
            FixedHeader
            ServerItemsLength="total"
            ItemsPerPage="defaultSize"
            Items="data"
            TItem="ListChartData"
            Loading="@isTableLoading"
            MustSort
            OnOptionsUpdate="OnTableOptionsChanged">
    <ItemColContent>
        @if (context.Header.Value == nameof(ListChartData.Name))
        {
            var text = GetService(context.Item.Name)?.AppDescription;
            if (string.IsNullOrEmpty(text))
                text = "无";
            <MTooltip Top Left Context="tooltipContent">
                <ActivatorContent>
                    <div @attributes="@tooltipContent.Attrs" class="text-truncate">
                        <a href="/apm/services/@(context.Item.Name+ GetUrlParam(service: context.Item.Name, env: GetSearchEnv(Search.Environment, context.Item.Envs?.Split(',')), comparisonType: Search.ComparisonType, start: Search.Start, end: Search.End))">
                            @context.Item.Name
                        </a>
                    </div>
                </ActivatorContent>
                <ChildContent>
                    <span>@text</span>
                </ChildContent>
            </MTooltip>
        }
        else if (context.Header.Value == nameof(ListChartData.Envs))
        {
            @string.Join(',', context.Item.Envs)
        }
        else if (context.Header.Value == nameof(ListChartData.Latency))
        {
            <div class="d-flex justify-start">
                <div>
                    @($"{context.Item.Latency} ms")
                </div>
                <div>
                    @if (context.Item.LatencyChartData != null && context.Item.LatencyChartData.HasChart)
                    {
                        <MECharts Option="context.Item.LatencyChartData.Data" Width="80" Height="24" />
                    }
                    else
                    {
                        <MIcon>mdi-chart</MIcon>
                    }
                </div>
            </div>
        }
        else if (context.Header.Value == nameof(ListChartData.Throughput))
        {
            <div class="d-flex justify-start">
                <div>
                    @($"{context.Item.Throughput} tpm")
                </div>
                <div>
                    @if (context.Item.ThroughputChartData != null && context.Item.ThroughputChartData.HasChart)
                    {
                        <MECharts Option="context.Item.ThroughputChartData.Data" Width="80" Height="24" />
                    }
                    else
                    {
                        <MIcon>mdi-chart</MIcon>
                    }
                </div>
            </div>
        }
        else if (context.Header.Value == nameof(ListChartData.Failed))
        {
            <div class="d-flex justify-start">
                <div>
                    @($"{context.Item.Failed} %")
                </div>
                <div class="ml-2">
                    @if (context.Item.FailedChartData != null && context.Item.FailedChartData.HasChart)
                    {
                        <MECharts Option="context.Item.FailedChartData.Data" Width="80" Height="24" />
                    }
                    else
                    {
                        <MIcon>mdi-chart</MIcon>
                    }
                </div>
            </div>
        }
    </ItemColContent>
</SDataTable>
<style>
    .m-data-table .m-data-table__wrapper {
        height: calc(100vh - 260px)
    }
</style>
<MCard Rounded=true Class="px-6 py-2" Style="border-top-left-radius: 0 !important; border-top-right-radius: 0 !important;">
    <SPagination Class="mt-2" @bind-Page="page" @bind-PageSize=defaultSize Total=total OnChange="OnPageChange" />
</MCard>